<!DOCTYPE html>
<html>
<head>
	<title>协同工分</title>
	<link rel="stylesheet" type="text/css" href="https://cdnjs.cloudflare.com/ajax/libs/toastr.js/latest/toastr.min.css">
	<script type="text/javascript" src="https://cdn.bootcss.com/jquery/3.2.0/jquery.min.js"></script>
	<script type="text/javascript" src="http://localhost:3000/js/art-template.js"></script>
	<script type="text/javascript" src="http://localhost:3000/js/bootstrap-datepicker.min.js"></script>
	<script type="text/javascript" src="http://localhost:3000/js/bootstrap-datepicker.zh-CN.min.js"></script>
	<!-- 最新版本的 Bootstrap 核心 CSS 文件 -->
    <link rel="stylesheet" href="https://cdn.bootcss.com/bootstrap/3.3.7/css/bootstrap.min.css" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous">
    <link rel="stylesheet" type="text/css" href="http://localhost:3000/css/bootstrap-datepicker.min.css">
    <!-- 最新的 Bootstrap 核心 JavaScript 文件 -->
    <script src="https://cdn.bootcss.com/bootstrap/3.3.7/js/bootstrap.min.js" integrity="sha384-Tc5IQib027qvyjSMfHjOMaLkfuWVxZxUPnCJA7l2mCWNIpG9mGCD8wGNIcPD7Txa" crossorigin="anonymous"></script>
    <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/toastr.js/latest/toastr.min.js"></script>
</head>
<body>
	<div class="container">
		<div class="row">
			<div class="col-md-8">
				<h2 class="score_title">工分统计结果</h2>
				<table class="table" id="content">
					<script id="test" type="text/html">
						<tr>
							<td>编号</td>
							<td>姓名</td>
							<td>年级</td>
							<td>工分</td>
						</tr>
						{{each resultarr}}
						<tr>
							<td>{{$value.id}}</td>
							<td>{{$value.name}}</td>
							<td>{{$value.class}}</td>
							<td>{{$value.userallscore}}</td>
						</tr>
						 {{/each}}
					</script>
				</table>
			</div>
			<div class="col-md-4">
				<h3>选择工分起止日期</h3>
				<div class="input-daterange input-group" id="datepicker">
				    <input type="text" class="input-sm form-control" name="start" id="starttime" value="2017-08-30" />
				    <span class="input-group-addon">to</span>
				    <input type="text" class="input-sm form-control" name="end" id="endtime"  value="2018-01-10" />
				</div>
				<h3>选择查询年级</h3>
				<select class="form-control">
				  <option value ="all">all</option>
				  <option value ="2015">2015</option>
				  <option value="2016">2016</option>
				  <option value="2017">2017</option>
				</select>
				<div class="showerr">
					<h3>数据库表这里数据有错哟</h3>
					<table id="myerr" class="table">
					<script id="errplace" type="text/html">
						<tr>
							<td>{{message}}</td>
						</tr>
				    	{{each resultarr}}
				    	 <tr>
						<td class="danger">{{$value.pid}}</td>
						</tr>
						{{/each}}
					</script>
					</table>
				</div>
				<button class="btn btn-primary score_refresh">刷新</button>
			</div>
		</div>
	</div>
</body>
<style type="text/css">
	.score_title{
		text-align: center;
	}
	.score_refresh{
		width: 80%;
		margin-top: 20px;
	}
</style>
<script type="text/javascript">
	$(function () {
		$('.showerr').hide();
		$('.input-daterange').datepicker({
			language: "zh-CN",
			 format: "yyyy-mm-dd"
        });
		operationData('http://localhost:3000/getdata','get',{})
		.then(function (data) {
			var html = template('test', data);
            document.getElementById('content').innerHTML = html;
		})
	})
	$('.score_refresh').click(function () {
		// console.log('.score_refresh')
  //       var data={
  //       	starttime:$('#starttime').val(),
  //       	endtime:$('#endtime').val()
  //       }
		// operationData('http://localhost:3000/reflash','post',data)
		// .then(function (data) {
		// 	console.log(data)
		// 	if (data.status==1) {
		// 		 $('.showerr').hide();
		// 		toastr.success("刷新成功啦!");
		// 		var html = template('test', data);
  //               document.getElementById('content').innerHTML = html;
		// 	}else if(data.status==2){
		// 		$('.showerr').show();
		// 		toastr.error("tasktree表任务百分比有错!");
		// 		data.message="tasktree表任务百分比"
		// 		var html = template('errplace', data);
		// 		document.getElementById('myerr').innerHTML=html;

		// 	}else if(data.status==3){
		// 		$('.showerr').show();
		// 		toastr.error("tasktuser表有错!");
		// 		data.message="tasktuser表任务百分比"
		// 		var html = template('errplace', data);
		// 		document.getElementById('myerr').innerHTML=html;

		// 	}else if(data.status==4){
		// 		$('.showerr').show();
		// 		toastr.error("taskuser表taskid有错!");
		// 		data.message="taskuser表有错的taskid"
		// 		var html = template('errplace', data);
		// 		document.getElementById('myerr').innerHTML=html;
		// 	}
			
		// })
		operationData('http://localhost:3000/test','get',{})
		.then(function (argument) {
			
		})
	})
	//用策略类改进算法
	var makeaction = {
		1:function () {
			$('.showerr').hide();
			toastr.success("刷新成功啦!");
			var html = template('test', data);
            document.getElementById('content').innerHTML = html;
		},
		2:function () {
			$('.showerr').show();
			toastr.error("tasktree表任务百分比有错!");
			data.message="tasktree表任务百分比"
			var html = template('errplace', data);
			document.getElementById('myerr').innerHTML=html;
		},
		3:function () {
			$('.showerr').show();
			toastr.error("tasktuser表有错!");
			data.message="tasktuser表任务百分比"
			var html = template('errplace', data);
			document.getElementById('myerr').innerHTML=html;
		}
	}
	function operationData(myurl,method,data){
		return $.ajax({
					type:method,
					url:myurl,
					data:data,
				})
	}
</script>
</html>